<template>
  <div class="zhibo">
    <Myhead>工地直播</Myhead>
    <!-- 导航 -->
    <Mynav>
      <template v-slot:left> 筛选 </template>
      <template v-slot:center> 阶段 </template>
      <template v-slot:right> 排序 </template>
    </Mynav>
    <!-- 列表 -->
    <div class="con">
        <div class="list">
     <list v-for="item in list" :key="item.id" :item="item" @click.native="gotodetail(item)"></list>
     </div>
     <Myfoot></Myfoot>
    </div>
  </div>
</template>

<script>
import Myhead from "@/components/Myhead";
import Mynav from "@/components/Mynav";
import list from '@/components/list'
import Myfoot from '@/components/Myfoot'

export default {
  data() {
    return {
        list:[]
    };
  },
  mounted() {
         this.$http.get('/home/zhibo').then(res => {
          console.log(res.data.list);
        this.list = res.data.list
      })
  },
  methods: {
    gotodetail(item){
      this.$router.push('/zhiboDetail')
    }
  },
  components: {
    Mynav,
    Myhead,
    list,
    Myfoot
  },
};
</script>

<style lang='scss'>
.zhibo {
    height: 100%;
    overflow: hidden;
}
.con {
    width: 100%;
    height: calc(100% - 120px);
    overflow: auto;
}
</style>
